<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>购物车</title>
    <script src="__INDEX__/js/mui.min.js"></script>
    <link href="__INDEX__/css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="__INDEX__/css/iconfont.css" />
    <link rel="stylesheet" href="__INDEX__/css/style.css" />
    <link rel="stylesheet" href="__INDEX__/css/yund.css" />
</head>
<body>
	
	<form  class="mui-input-group "  id='my_form' action="{:url('shop/add_cart_order')}">
	<nav class="mui-bar mui-bar-tab pay_bar_tab">
	    <div class="mui-tab-item left clearfix">
	    	<div class="l_left clearfix">
	    		<div class="mui-input-row mui-checkbox zleft">
					<input name="all_check" id='all_check' onchange="all_checkbox()"  type="checkbox">
				</div>
				<label>全选</label>
	    	</div>
	    	<div class="l_right">合计：<em>¥</em><em id='total_money'>0.00</em></div>
	    </div>
	    <a class="mui-tab-item right" id='jiesuan_js'>结算</a>
	</nav>
	<div class="mui-content">
		<div class="pay_ordinfo">
	    	<ul class="pay_ord_list">
	    		{volist name='car_list' id='goods_info'}
	    		<li class="clearfix">
	    			<div class="paylis_zleft">
		    			<div class="mui-input-row mui-checkbox">
							<input name='is_check' data-goodsid='{$goods_info.goods_id}' onchange="onclik_check('{$goods_info.goods_id}',this)"   type="checkbox">
						</div>
					</div>
	    			<div class="pay_ord_sp clearfix">
	    				<div class="pay_ospbox">
				    		<div class="pay_sp_img">
				    			<img src="{$goods_info['thumb']}">
				    		</div>
				    		<div class="pay_sp_info">
				    			<p class="pay_spnam">{$goods_info['goods_name']}</p>
				    			<div class="pay_sppribox clearfix">
				    				<div class="pay_sppri" id='goods_id{$goods_info.goods_id}'>{$goods_info['sale_price']}</div>
				    				<a href="javascript:void(0)" onclick="del_cart('{$goods_info.id}')">删除</a>
				    				<div class="mui-numbox pay_spnum">
										<button class="mui-btn mui-btn-numbox-minus" onclick="account('{$goods_info.goods_id}',1)" type="button">-</button>
										<input class="mui-input-numbox" id="goods_num{$goods_info.goods_id}"  type="number" value="{$goods_info['goods_num']}" />
										<button class="mui-btn mui-btn-numbox-plus" onclick="account('{$goods_info.goods_id}',2)" type="button">+</button>
									</div>
				    			</div>
				    		</div>
			    		</div>
			    	</div>
	    		</li>
	    		{/volist}
	    	</ul>
	    </div>
	</div>
	</from>
	{include file="public/footer" /}
</body>
</html>

<script>
	/**合计
	 * @param  goods_id
	 * @param  symbol :1减，2加
	 */
	function account(goods_id,symbol){
		var goods_num = $('#goods_num'+goods_id).val();
		
		if($('#goods_num'+goods_id).val()<=0){
			layer.msg("请输入商品数量", {
				  icon: 1,
				  time: 1500 //2秒关闭（如果不配置，默认是3秒）
			}, function(){
				  location.reload();
			});
			return ;
		}
		
		var result = $("input[type='checkbox']").is(':checked');
		if(!result){
			layer.msg("请选择商品", {
				  icon: 1,
				  time: 1500 //2秒关闭（如果不配置，默认是3秒）
			}, function(){
				  location.reload();
			}); 
		}
		//获取商品价格
		var goods_price = $('#goods_id'+goods_id).text();
		if(symbol == 2){
			var total_money = parseInt(goods_price)  + parseInt($('#total_money').text());
		}else{
			total_money = parseInt($('#total_money').text()) - parseInt(goods_price)
		}
		$('#total_money').text(total_money);
	}
	
	//提交
	$('#jiesuan_js').click(function(){
		var result = $("input[type='checkbox']").is(':checked');
		if(result){
		
			layer.confirm('您确定付款？', {
				btn: ['确定', '取消'] //按钮
			}, function() {
				var post_data = "";
				var goods_list =new Array();
				//获取商品id
				$("input:checkbox[name='is_check']:checked").each(function() {
					if($('#goods_num'+$(this).data("goodsid")).val() <= 0){
						layer.msg("请输入商品数量", {
							  icon: 1,
							  time: 1500 //2秒关闭（如果不配置，默认是3秒）
						}, function(){
							  location.reload();
						});
					}
					
					
					post_data +=$(this).data("goodsid")+":"+ $('#goods_num'+$(this).data("goodsid")).val()+",";
				});
				
				post_data = post_data.substring(0,post_data.length-1);
				
				$.ajax({
					type:"post",
					url: "{:url('index/add_cart_order')}",
					data: {post_data :post_data},//表单数据
					success: function(data) {
						layer.msg(data.msg, {
						  icon: 1,
						  time: 1500 //2秒关闭（如果不配置，默认是3秒）
						}, function(){
							  if(data.code == 200) {
									location.href = "{:url('index/querdd')}"+"?order_id="+data.data;
							  }
						}); 
						
						layer.msg(data.msg);
					}
				})
			})
		}else{
			layer.msg('请选择商品');
		}
	});
	
	//全选
	function all_checkbox(){
		var rest = $('#all_check')[0]['checked'];
		
		if(rest){
			$("input[name='is_check']").attr('checked','checked');
		}
	}
	
	//选中单个
	function onclik_check(id,obj){
		
		if(obj.checked){
			//获取商品价格
			var goods_price = $('#goods_id'+id).text();
			
			var total_money = parseInt(goods_price)  + parseInt($('#total_money').text());
			
		}else{
			var goods_price = $('#goods_id'+id).text();
			
			var total_money = parseInt($('#total_money').text()) - parseInt(goods_price);
		}
		
		$('#total_money').text(total_money);
		
	}
	
	function del_cart(id){
		layer.confirm('您确定要删除吗？', {
			btn: ['确定', '取消'] //按钮
		}, function() {
			$.ajax({
				type:"post",
				url: "{:url('index/del_cart_order')}",
				data: {cart_id:id},//表单数据
				success: function(data) {
					layer.msg(data.msg, {
					  icon: 1,
					  time: 1500 //2秒关闭（如果不配置，默认是3秒）
					}, function(){
						  if(data.code == 200) {
								location.reload();
						  }
					}); 
				}
			})
		})
	}
	
</script>